<template>
  <div>
    <div class="floating">
      <!--<a href="http://wpa.qq.com/msgrd?v=3&uin=2568486231&site=qq&menu=yes" target="_blank"><img src="./images/qq.png" alt="" width="80" height="110"></a>-->
      <!--<div @click="toggle()">-->
        <!--<img src="./images/wx.png" alt="" width="80" height="110">-->
      <!--</div>-->
    </div>
    <!--<div class="box_data"  v-show="isShow">-->
      <!--<img src="./images/false.png" alt="" @click="toggle()">-->
      <!--<input type="text" placeholder="姓">-->
      <!--<input type="text" placeholder="名">-->
      <!--<input type="text" placeholder="电子邮箱">-->
      <!--<input type="text" placeholder="国家/地区">-->
      <!--<input type="text" placeholder="电话号码">-->
      <!--<input type="checkbox" id="name">-->
      <!--<label for="name">我不愿意收到日后促销方案信息</label>-->
      <!--<div>立即提交</div>-->
    <!--</div>-->
    <!--<div class="mask" v-show="isShow"></div>-->
  </div>
</template>

<script type="text/ecmascript-6">
  export default{
    data(){
        return{
          isShow:false
        }
    },
    methods:{
      toggle:function(){
        this.isShow = !this.isShow;
      }
    }
  }
</script>

<style scoped>
  .box_data img{
    width: 36px;
    height: 36px;
    display: block;
    position: absolute;
    top:20px;
    right: 20px;
  }
  .mask{
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    position: fixed;
    top:0;
    z-index: 1;
  }
  .floating {
    position: fixed;
    bottom: 5%;
    right: 50px;
    z-index: 100;
  }

  .floating img {
    display: block;
  }

  .floating img:nth-child(1) {
    margin-bottom: 29px;
  }

  .box_data {
    width: 396px;
    height: 512px;
    background: url("./images/bg_data.png");
    -webkit-background-size: cover;
    background-size: cover;
    position: fixed;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    padding: 120px 30px 0px;
    z-index: 2;
    box-sizing: border-box;
  }

  .box_data input {
    height: 33px;
    background: #eeeeee;
    font-size: 14px;
    color: #999999;
    text-indent: 10px;
    border: 1px solid #a3a3a3;
    border-radius: 3px;
    width: 334px;
    margin-top: 20px;
  }

  .box_data input:nth-child(2), .box_data input:nth-child(3) {
    width: 158px;
    height: 33px;
    margin-top: 0px;
  }

  .box_data input:nth-child(3) {
    margin-left: 8px;
  }

  .box_data input[type="checkbox"] {
    width: 12px;
    height: 12px;
    margin-top: 20px;
    border-radius: 0px;
  }

  .box_data label {
    font-size: 14px;
    color: #999999;
  }

  .box_data div {
    width: 334px;
    height: 40px;
    background: #4e75c3;
    border: 1px solid #6562bd;
    border-radius: 3px;
    text-align: center;
    line-height: 40px;
    margin-top: 41px;
    font-size: 14px;
    color: #fff;
  }
</style>
